/* 金讲堂详情页 */
.content {
  background: #fff;
}

.bar-box {
  box-sizing: border-box;
  display: -webkit-flex;
  display: flex;
  flex-direction: row;
  align-items: center;
  width: 100%;
  height: 100%;

  .bar-left,
  .bar-right {
    display: -webkit-flex;
    display: flex;
    align-items: center;
    height: 100%;

    img {
      width: 1.45rem;
      height: 1.45rem;
    }

    a {
      margin: 0 0.5rem;
      color: #5f646e;
    }
  }

  .searchs {
    flex: 1;
    margin: 0 0.5rem;
  }

  .bar-right img {
    margin-right: 0.5rem;
  }
}

.classroomDetail {
  .classroom-header {
    width: 100%;
    padding: 0.5rem 0;
  }
}

.container {
  padding: 0 4%;
}

.content-box {
  display: flex;
  display: -webkit-flex;
  flex-direction: row;
  align-items: center;

  .content-img {
    display: flex;
    display: -webkit-flex;

    img {
      width: 2.5rem;
      height: 2.5rem;
      border-radius: 50%;
    }
  }

  .content-inner {
    width: 100%;
    margin: 0;
    padding: 0;
    margin-left: 0.5rem;

    .content-title-row {
      display: flex;
      display: -webkit-flex;
      flex-direction: row;
      align-items: center;
      justify-content: space-between;

      .content-title {
        .tag {
          margin-left: 1rem;
          font-size: 0.75rem;
        }
      }
    }

    .content-subtitle {
      font-size: 0.75rem;
    }
  }
}

.orther-content-box {
  span {
    margin-right: 0.5rem;
    font-size: 0.75rem;
    color: #6d6d72;
  }
}

.content-container {
  width: 100%;
}

.nav-box {
  display: flex;
  display: -webkit-flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: 0 0.75rem;

  .icon-box {
    display: flex;
    display: -webkit-flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

    .icons-keep,
    .icons-share {
      width: 1.2rem;
      height: 1.2rem;
      background: url(../../../img/home/keep.png) no-repeat center;
      background-size: contain;
    }

    .icons-share {
      background-image: url(../../../img/home/share.png);
    }

    .icons-keep-sel {
      background-image: url(../../../img/home/keep_sel.png);
    }

    span {
      font-size: 0.7rem;
    }
  }
}

.zan {
  text-align: center;

  .zan-icons {
    display: inline-block;
    padding-top: 2rem;
    width: 1.5rem;
    background: url(../../../img/home/zan.png) no-repeat center top;
    background-size: contain;
  }

  .zan-sel {
    background-image: url(../../../img/home/zan_sel.png);
  }
}

.recommend-container {
  box-sizing: border-box;
  padding: 0 0.75rem;
  overflow: hidden;

  .recommend-title {
    padding: 1rem 0 0.5rem;
    border-top: 1px solid #e1e1e1;
  }

  /* .card_flex__inner {
    padding: 0.2rem 0;

    p {
      margin: 0;
    }

    .label-box {
      box-sizing: border-box;
      padding: 0.5rem 0;
      font-size: 0.75rem;

      .label {
        box-sizing: border-box;
        margin-right: 0.2rem;
        padding: 0.2rem 0.5rem;
        border-radius: 1.35rem;
        border: 1px solid #e1e1e1;

        &:nth-last-child(1) {
          margin-right: 0;
        }
      }
    }
  } */

  .list-block {
    margin: 0;

    ul {
      li:nth-last-child(1) {
        &::after {
          content: '';
          height: 0px;
          width: 0px;
          background: transparent;
        }
      }

      li::after {
        content: '';
        position: absolute;
        left: 0;
        bottom: 0;
        right: auto;
        top: auto;
        height: 1px;
        width: 100%;
        background-color: #e7e7e7;
        display: block;
        z-index: 15;
        -webkit-transform-origin: 50% 100%;
        transform-origin: 50% 100%;
      }

      &::before,
      &::after {
        content: '';
        height: 0px;
        width: 0px;
        background: transparent;
      }
    }

  }

  .card_box__content {
    padding-left: 0;
    color: inherit;

    .card_box__content_subtile {
      display: -webkit-flex;
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      align-items: center;
    }

    .no-img {
      margin-left: 0;

      .item-subtitle {
        margin-top: 0.5rem;
      }
    }
  }


  .flex-postiton {
    flex-direction: row-reverse;

    .item-inner {
      margin-left: 0;
    }
  }

  .desc {
    font-size: 0.75rem;
    color: #3d4145;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

}

.comment {
  .comment-title {
    padding: 0 0.75rem;
    display: flex;
    display: -webkit-flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #e1e1e1;

    .num {
      font-size: 0.75rem;
    }
    a {
      color: inherit;
    }
    .icon.icon-right {
      color: #b1b1b1;
    }
  }

  .comment-container {
    display: none;
    padding: 0 0.75rem;

    .comment-card {
      box-shadow: none;
      margin: 0;
      border-radius: 0px;
      box-sizing: border-box;
      border-bottom: 1px solid #e1e1e1;

      & div {
        padding: 0;
      }
      &:nth-last-child(1) {
        border: none;
      }

      .comment-header {
        display: flex;
        display: -webkit-flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: center;
        padding: 0.5rem 0;

        .avatar {
          display: flex;
          display: -webkit-flex;
          justify-content: center;
          align-items: center;
          padding: 0.2rem;

          img {
            width: 2rem;
            height: 2rem;
            border-radius: 50%;
          }
        }
        .comment-name {
          margin-left: 0.5rem;
        }
      }
      .commet-footer {
        display: flex;
        display: -webkit-flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
      }
    }
  }
}

.infinite-scroll-preloader {
  display: none;
}